<template>
  <div class="dashboard-container">
    <Card :data-source="infoCard" />
    <el-row :gutter="8">
      <el-col :span="8">
        <el-card>
          <bar-chart id="demo1" title="柱状图" :data-source="dataSource" type="Bar" />
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card>
          <bar-chart id="demo2" title="折线图" :data-source="dataSource" type="Line" />
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card>
          <pie-chart id="demo3" title="饼图" :data-source="dataSource" />
        </el-card>
      </el-col>
    </el-row>

    <el-row :gutter="8">
      <el-col :span="8">
        <el-card>
          <gauge-chart id="demo4" title="仪表盘" :data-source="gaugeDataSource" />
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card>
          <radar-chart id="demo5" title="雷达图" :data-source="radarDataSource" />
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card>
          <doughnut-chart id="demo6" title="甜甜圈" :data-source="dataSource" />
        </el-card>
      </el-col>
    </el-row>

  </div>
</template>

<script>
import Card from '@neu/biz-core/components/Card'
import BarChart from '@neu/biz-core/components/Charts/BarChart'
import PieChart from '@neu/biz-core/components/Charts/PieChart'
import GaugeChart from '@neu/biz-core/components/Charts/GaugeChart'
import RadarChart from '@neu/biz-core/components/Charts/RadarChart'
import DoughnutChart from '@neu/biz-core/components/Charts/DoughnutChart'
export default {
  name: 'Dashboard',
  components: {
    Card,
    BarChart,
    PieChart,
    GaugeChart,
    RadarChart,
    DoughnutChart
  },
  data() {
    return {
      infoCard: [ // 卡片
        { name: '待办任务', total: '10', icon: 'todo', totalColor: 'success' },
        { name: '当前告警', total: '0', icon: 'alarm', totalColor: 'danger' },
        { name: '巡检异常点', total: '2', icon: 'unusual', totalColor: 'warning' },
        { name: '离线设备总量', total: '1', icon: 'info', totalColor: 'primary' },
        { name: '异常设备总数', total: '0', icon: 'info', totalColor: 'primary' },
        { name: '监控设备总数', total: '350', icon: 'monitor', totalColor: 'info' }
      ],
      dataSource: [
        ['财年', '2015', '2016', '2017'],
        ['车辆', 43.3, 85.8, 93.7],
        ['办公电子', 83.1, 73.4, 55.1],
        ['电子相关', 86.4, 65.2, 82.5],
        ['财务用品', 72.4, 53.9, 39.1]
      ],
      gaugeDataSource: [
        ['完成率', 4]
      ],
      radarDataSource: [
        ['维度', '销售', '管理', '信息技术', '客服', '市场'],
        ['各维度最大值', 65, 16, 30, 38, 52],
        ['预算分配', 43, 10, 28, 35, 50],
        ['实际开销', 50, 14, 28, 31, 42]
      ]
    }
  },
  computed: {
    //
  },
  methods: {
    //
  }
}
</script>
<style lang="scss" scoped>

</style>
